<template>
    <MgsDrag visible title="drag" style="width: 400px; height: 500px">
        <MgsTree show-checkbox :data="data" />
    </MgsDrag>
</template>

<script>
import MgsDrag from '@mgs/components-basic/mgs-drag';
import MgsTree from '@mgs/components-basic/mgs-tree';

export default {
    components: { MgsDrag, MgsTree },
    data() {
        return {
            vis: true,
            data: [
                {
                    id: 1,
                    label: '一级 1',
                    children: [
                        {
                            id: 4,
                            label: '二级 1-1',
                            children: [
                                {
                                    id: 9,
                                    label: '三级 1-1-1',
                                },
                                {
                                    id: 10,
                                    label: '三级 1-1-2',
                                },
                            ],
                        },
                    ],
                },
                {
                    id: 2,
                    label: '一级 2',
                    children: [
                        {
                            id: 5,
                            label: '二级 2-1',
                        },
                        {
                            id: 6,
                            label: '二级 2-2',
                        },
                    ],
                },
                {
                    id: 3,
                    label: '一级 3',
                    children: [
                        {
                            id: 7,
                            label: '二级 3-1',
                        },
                        {
                            id: 8,
                            label: '二级 3-2',
                        },
                    ],
                },
            ],
        };
    },
    methods: {},
};
</script>
